import React, { Component } from 'react';
import PropTypes from "prop-types";
import {
    View,
    StyleSheet,
    Platform
} from 'react-native';

import Color from '../../config/theme/standard/color';
import Label from "../label";
import Fonts from '../../config/theme/standard/fonts';
export default class Baseline extends Component{

    constructor(props) {
        super(props);
    }

    render() {
        let { isShowLine } = this.props
        return (
            <View style={styles.container}>
                { isShowLine &&  <View style={[styles.line, {marginRight: 16}]}/>}
                <Label text={this.props.text} labelStyle={{color: Color.baseline.labelColor, fontSize: Fonts.baseline.labelFontSize}}/>
                { isShowLine &&  <View style={[styles.line, {marginLeft: 16}]}/>}
            </View>
        )

    }
}

const styles = StyleSheet.create({
    container: {
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
        paddingHorizontal: 40,
    },
    line: {
        flex: 1,
        height: (Platform.OS === 'web')? 2:1,
        backgroundColor: Color.baseline.lineColor,
    }
});

Baseline.propTypes ={
    text: PropTypes.string,
    //底线文字内容
    isShowLine: PropTypes.bool
};

Baseline.defaultProps = {
    text: '没有更多内容啦',
    isShowLine: true
};
